<template>
    <div>
        <NavBar :title="title"></NavBar>
        <Search></Search>
        <Swipe :images="images" :imgwidth="imgwidth" :imgheight="imgheight"></Swipe>
        <van-grid :column-num="4">
            <van-grid-item v-for="item in catitemsApiData" :icon="item.image_src" :text="item.name" />
            <van-grid-item v-for="item in catitemsApiData" :icon="item.image_src" :text="item.name" />
        </van-grid>
        <Ms></Ms>
        <div v-show="start">
            {{ time }}
        </div>
    </div>
</template>

<script setup>
import NavBar from '@/components/NavBar.vue';
const title = '刷新'
import Search from '@/components/Search.vue';
import Swipe from '@/components/Swipe.vue';
const images = [
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-2.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-3.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-4.jpeg',
];
import Ms from '@/components/ms.vue';
const imgwidth = '100%'
const imgheight = '200px'
import { ref } from 'vue';
const catitemsApiData = ref([])
import { catitemsApi } from '@/api/api';
catitemsApi().then(res => {
    console.log(res);
    catitemsApiData.value = res.data.message
})

</script>

<style lang="scss" scoped></style>